<template>
  <rx-dialog @handOk="handleSubmit" @cancel="cancel">
    <rx-layout>
      <div slot="center" style="padding: 20px;">
          <a-form>
              <a-row :gutter="24">
                  <a-col :span="12">
                      <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="i18n('form.sourceName','源名称')">
                          <a-input  :disabled="true"  v-model="record.name" />
                      </a-form-item>
                  </a-col>
                  <a-col :span="12" >
                      <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="i18n('form.sourceKey','源标识键')">
                        <a-input  :disabled="true" v-model="record.key" />
                      </a-form-item>
                  </a-col>
              </a-row>
              <a-row :gutter="24">
                  <a-col :span="12">
                      <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="i18n('form.newName','新名称*')">
                          <a-input v-model="newName" />
                      </a-form-item>
                  </a-col>
                  <a-col :span="12" >
                      <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="i18n('form.newKey','新标识键*')">
                          <a-input  @change="checkKey"  v-model="newKey" />
                      </a-form-item>
                  </a-col>
              </a-row>
              <a-row>
                  <span v-if="errorMsg" class="errormsg">{{errorMsg}}</span>
              </a-row>
          </a-form>
      </div>
    </rx-layout>
  </rx-dialog>
</template>

<script>
  import { RxDialog, Util, RxLayout } from "@lowcode/jpaas-common-lib";
  export default {
    name: "copy-form-bo-list",
    components: {
      RxDialog,
      RxLayout
    },
    props: {
      layerid: String,
      destroy: Function,
      record: Object
    },
    data(){
      return{
        newName:"",
        newKey:"",
        errorMsg:"",
          labelCol:{span:6},
          wrapperCol:{span:18}
      }
    },
    methods: {
      i18n(name,text,key){
          return this.$ti18(name,text,"formBoList",key);
      },
      handleSubmit() {
        if(this.newKey==""||this.newName==""||this.errorMsg!=""){
          this.$notification["warning"]({
            message: this.$ti18('rxMsa.actionTips','操作提示'),
            description: this.i18n('msg.submitMsg','"请检查新名称与标识键是否正确!"'),
          });
          return;
        }
        var obj={
          newKey:this.newKey,
          newName:this.newName,
          oldPkId:this.record.pkId
        };
        Util.closeWindow(this, "ok",obj);
      },
      cancel() {
        Util.closeWindow(this, "cancel");
      },
      checkKey(e){
        if(this.newKey!=""){
          if (/^[a-zA-Z][a-zA-Z0-9_]*$/g.test(this.newKey)) {
            this.errorMsg="";
          }else{
            this.errorMsg=this.i18n('msg.checkMsg',"要求英文+数字,英文开头!");
          }
        }
      }
    },

  }
</script>

<style scoped>
  .errormsg{
    color:#DD0000;
    margin-left: 4px;
  }
</style>